$(function(){
    $('#keyword').on('keyup',function (){
        const keyword = $(this).val();
        if(keyword!==null&&keyword!==''&&keyword.length!==0){
            $.ajax({
                type   :'GET',
                url    :'http://localhost:8088/profileSearchAjax?keyword='+keyword,
                success:function (list){
                    console.log(keyword);
                    let productListHTML = '';
                    for(let i=0; i<list.length; i++){
                        productListHTML+='<li class=\"productAutoItem\" data-userid="';
                        productListHTML+=list[i].userid;
                        productListHTML+='">';
                        productListHTML+=list[i].userid;
                        productListHTML+='</li>';

                    }
                    $('#productAutoList').html(productListHTML);
                    $('#productAutoComplete').show();
                },
                error  :function (errorMsg){
                    console.log(errorMsg);
                }
            });
        }else{
            $('#productAutoComplete').hide();
        }

    });

    $(document).on('click','.productAutoItem',function (){
        const userId = $(this).data('userid');
        console.log(userId);
        $('#productAutoComplete').hide();
        $('#keyword').val('');
        window.location.href='http://localhost:8088/searchProfile?keyword='+userId ;
    });

    var origin = document.getElementById("origin");//这个是第一个界面
    var obj = document.getElementById("addProfile");//这个是第二个界面
    var objEdit = document.getElementById("updateProfile");//这个是第三个界面

    var confirmButton = document.getElementsByName("newProfile");//这个是确认按钮
    var EditButton = document.querySelectorAll('.profileEditButton');//这个是编辑按钮的集合

    obj.style.display="none";
    objEdit.style.display="none";

    $('#newProfile').on('click',function(){
        origin.style.display="none";//隐藏
        obj.style.display="";//显示
    });

    EditButton.forEach(function(element){
        //将每一个Edit进行绑定
        element.onclick=function(){
            console.log("Edit successfully");
            origin.style.display="none";//隐藏
            objEdit.style.display="";//显示
            var name = this.getAttribute("name");
            var userid = document.getElementsByName("updateuserid");
            if (userid != null){
                console.log('取到');
                userid.value="ni hao";
                userid.value="hello";
            }else{
                console.log('未取到');
            }

            var la = document.getElementsByName("updatela");
            var fa = document.getElementsByName("updatefa");
            //接下来要写ajax了
            $.ajax({
                type     :'GET',
                url      :'http://localhost:8088/profileEditAjax?userid='+name,
                success  :function (data){
                    console.log(data.userid);
                    //取到键值对了
                    userid[0].value = data.userid;
                    la[0].value = data.la;
                    fa[0].value = data.fa;
                },
                error    :function (errorMsg){
                    console.log(errorMsg);
                }
            });
        }
    });

});